<template>
	<div class="uiwu-pagination" v-if="total > limit">
		<el-pagination hide-on-single-page background layout="prev, pager, next" :page-size="limit" :total="total" @current-change="currentChange" />
	</div>
</template>

<script setup lang="ts">
	/**
	 * 分页组件
	 * @author: uw
	 * @since: 2023-03-14
	 * @update: 2023-03-14
	 * @version: 0.0.1
	 * @property {Number} limit 每页条数
	 * @property {Number} currentPage 当前页
	 * @property {Number} total 总条数
	 * @event {Function} change 页码改变时触发
	 * @example
	 * <uiwu-pagination :limit="10" :currentPage="1" :total="100" @change="changePage" />
	 *
	 */
	const props = defineProps({
		limit: {
			type: Number,
			default: 10
		},
		currentPage: {
			type: Number,
			default: 1
		},
		total: {
			type: Number,
			default: 0
		}
	})
	const emits = defineEmits(['change'])
	const currentChange = (e:number)=>{
		emits('change',e)
	}
</script>

<style scoped>
	.uiwu-pagination{
		display: flex;
		justify-content: center;
		margin-top: 10px;
	}
</style>